<style lang="less">

</style>
<template>
    <div>
        <Card>
            <p slot="title">
                <Icon type="edit"></Icon>
                设置抽签信息
            </p>
            <Row class="apply-set">
                <Form ref="setApplyForm"
                  :model="setApplyForm" :label-width="100" label-position="right"
                  :rules="ruleSetApply" inline>

                    <FormItem label="分拨数" prop="group">
                        <InputNumber :min="1" v-model="setApplyForm.group"
                               placeholder="请输入分拨数"></InputNumber>
                    </FormItem>
                    <FormItem label="裁判数" prop="referee">
                        <InputNumber :min="0" v-model="setApplyForm.referee"
                               placeholder="请输入裁判数"></InputNumber>
                    </FormItem>
                    <FormItem label="场次数" prop="round">
                        <InputNumber :min="1" v-model="setApplyForm.round"
                               placeholder="请输入场次数"></InputNumber>
                    </FormItem>
                    <!-- <FormItem label="总档位数" prop="levels">
                        <InputNumber :min="0" v-model="setApplyForm.levels"
                               placeholder="请输入总档位数"></InputNumber>
                    </FormItem> -->
                    <FormItem label="裁判所在档位" prop="referee_level" style="width: 300px">
                        <Select v-model="setApplyForm.referee_level">
                            <Option :value="0">门将档</Option>
                            <Option :value="1">一档</Option>
                            <Option :value="2">二档</Option>
                            <Option :value="3">三挡</Option>
                            <Option :value="4">四挡</Option>
                            <Option :value="5">五挡</Option>
                            <Option :value="6">六挡</Option>
                            <Option :value="7">七挡</Option>
                            <Option :value="8">八挡</Option>
                            <Option :value="9">九挡</Option>
                        </Select>
                    </FormItem>
                    <FormItem>
                        <Button type="primary" @click="handleSubmitSet" :loading="saveLoading">保存</Button>
                    </FormItem>
                </Form>
            </Row>
            <Row class="apply-operation">
                <Button @click="addPlayer" type="primary" icon="plus-round">添加球员</Button>
                <Button @click="delPlayer" type="ghost" icon="trash-a">删除球员</Button>
                <Button @click="addRootLevel" type="primary" icon="plus-round">添加档位</Button>
                <Button @click="delLastLevel" type="ghost" icon="trash-a">删除最后一档</Button>
                <Button @click="resetDrawlot" type="warning" icon="trash-a">重置抽签（慎用）,用于在抽签活动一半时重新设置后，所有队员重新抽签</Button>
            </Row>
            <Row type="flex" justify="start" class="code-row-bg">
                <Col span="6">
                  <Tree :data="apply_player_data" @on-select-change="selectTree"></Tree>
                  <Spin size="large" fix v-if="tree_loading"></Spin>
                </Col>
            </Row>
            <Modal v-model="add_player_show" :closable='false' :mask-closable=false :width="500">
                <h3 slot="header" style="color:#2D8CF0">选择队员</h3>
                <Select v-model="add_player_id" @on-change="get_add_player_id">
                    <Option v-for="item in apply_user" :value="item.user_id" :key="item.user_id">{{ item.realname }}</Option>
                </Select>
                <div slot="footer">
                    <Button type="text" @click="cancelAddplayer">取消</Button>
                    <Button type="primary" @click="handleSubmit_addplayer" :loading="add_player_Loading">保存</Button>
                </div>
            </Modal>
        </Card>
        <Spin size="large" fix v-if="open_loading"></Spin>
    </div>
</template>
<script>
    export default {
        data() {
            return {
                open_loading:false,
                tree_loading:false,
                saveLoading:false,
                setApplyForm: {
                    id: 0,
                    group: 0,
                    referee: 0,
                    round: 0,
                    /*levels: 0,*/
                    referee_level: -1
                },
                ruleSetApply: {
                    
                },
                apply_player_data:[],
                selectList: [],
                selectCount: 0,
                apply_user:[],
                add_player_show:false,
                add_player_Loading:false,
                add_player_id: '',
                current_select_tree_node: 0,
            }
        },
        created() {
            let t = this;
            t.init();
        },
        methods: {
            init() {
                let t = this;
                t.open_loading = true;
                t.$util.ajax.get('/admin/applys/' + this.$route.params.apply_id).then(function (response) {
                    if(response.data.status == 'success'){
                        let apply_data = response.data.data.apply;
                        console.log(apply_data);
                        t.setApplyForm.id = t.$route.params.apply_id;
                        t.setApplyForm.group = parseInt(apply_data.group);
                        t.setApplyForm.referee = parseInt(apply_data.referee);
                        t.setApplyForm.round = parseInt(apply_data.round);
                        /*t.setApplyForm.levels = parseInt(apply_data.levels);*/
                        t.setApplyForm.referee_level = parseInt(apply_data.referee_level);
                        t.getApplyPlayerList();
                    }
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                    t.open_loading = false;
                });
                
              
            },
            handleSubmitSet(){
                let t = this;
                console.log(t.setApplyForm.group);
                console.log(t.setApplyForm.referee);
                console.log(t.setApplyForm.round);
                /*console.log(t.setApplyForm.levels);*/
                console.log(t.setApplyForm.referee_level);
                t.$refs.setApplyForm.validate((valid) => {
                    if (valid) {
                        t.saveLoading = true;
                        var params = {
                            setApplyForm: t.setApplyForm,
                        }
                        t.$util.ajax.put('/admin/applys',params).then(function (response) {
                            let response_data = response.data;
                            if(response_data.status == 'success'){
                                t.$Notice.success({
                                    title: response_data.message
                                })
                            }
                            t.saveLoading = false;
                        }, function (error) {
                            t.$Notice.warning({
                                title: '出错了',
                                desc: error.message
                            });
                            t.saveLoading = false;
                        })
                    }
                });
            },
            addPlayer(){
                //在指定档位增加球员增加
                console.log(this.current_select_tree_node);
                if( this.current_select_tree_node.length == 1 && typeof(this.current_select_tree_node[0].level) != "undefined"){
                    console.log(this.current_select_tree_node[0].level);
                    this.add_player_show = true;
                }else{
                    this.$Notice.warning({
                        title: '请选择一个档位',
                    });
                }
                
            },
            addRootLevel(){
                console.log(this.apply_player_data.length);
                var title = '';
                var index = parseInt(this.apply_player_data[this.apply_player_data.length-1].level) + 1;
                console.log(index);
                if(index == 0){
                    title = "门将";
                }else if(index == 1){
                    title = "一档";
                }else if(index == 2){
                    title = "二档";
                }else if(index == 3){
                    title = "三档";
                }else if(index == 4){
                    title = "四档";
                }else if(index == 5){
                    title = "五档";
                }else if(index == 6){
                    title = "六档";
                }else if(index == 7){
                    title = "七档";
                }else if(index == 8){
                    title = "八档";
                }else if(index == 9){
                    title = "九档";
                }
                var obj = {
                    title: title,
                    level: index,
                    expand: true,
                    children: []
                }
                this.apply_player_data.push(obj);
            },
            delLastLevel(){
                let t = this;
                console.log(this.apply_player_data.length);
                console.log(this.apply_player_data[this.apply_player_data.length-1].level);
                //删除最后一个档位的球员
                this.$util.ajax.post('/admin/applys/del_level', {
                    apply_id: this.$route.params.apply_id,
                    level: this.apply_player_data[this.apply_player_data.length-1].level 
                }).then(function (response) {
                    let response_data = response.data;
                    t.$Notice.success({
                        title: response_data.message
                    })
                    t.getApplyPlayerInfo();
                    t.tree_loading = true;
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                })
            },
            resetDrawlot(){
                let t = this;
                console.log('清空并重置抽签信息');
                this.$util.ajax.post('/admin/applys/reset_drawlot', {
                    apply_id: this.$route.params.apply_id, 
                }).then(function (response) {
                    let response_data = response.data;
                    t.$Notice.success({
                        title: response_data.message
                    })
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                })
            },
            delPlayer(){
                let t = this;
                let current_level_apply_player_data = {};
                //删除指定球员，且不能是该档位最后一名球员
                console.log(this.apply_player_data);
                console.log(this.current_select_tree_node);
                if( this.current_select_tree_node.length == 1 && typeof(this.current_select_tree_node[0].id) != "undefined"){
                    console.log(this.current_select_tree_node[0].id);
                    console.log(this.current_select_tree_node[0].apply_id);
                    console.log(this.current_select_tree_node[0].user_id);
                    console.log(this.current_select_tree_node[0].user_level);
                    
                    this.apply_player_data.forEach( (item) => {
                        if(item.level == this.current_select_tree_node[0].user_level){
                            t.current_level_apply_player_data = item;
                            console.log(t.current_level_apply_player_data);
                        }          
                    });
                    if(this.current_level_apply_player_data.children.length == 1 ){
                        t.$Notice.success({
                            title: "仅剩一名队员，无法删除档位"
                        })
                        return;
                    }
                    //删除操作
                    t.$util.ajax.post('/admin/applys/del_player', {
                        id: this.current_select_tree_node[0].id,
                    }).then(function (response) {
                        let response_data = response.data;
                        t.$Notice.success({
                            title: response_data.message
                        })
                        t.getApplyPlayerInfo();
                        t.tree_loading = true;
                    }, function (error) {
                        t.$Notice.warning({
                            title: '出错了',
                            desc: error.message
                        });
                    })
                }else{
                    this.$Notice.warning({
                        title: '请选择一名球员',
                    });
                }
            },
            selectTree(v) {
                console.log('--------------selectTree-------------');
                console.log(v);
                this.current_select_tree_node = v;
            },
            cancelAddplayer(){
                this.add_player_id = '';
                this.add_player_show = false;
            },
            handleSubmit_addplayer(){
                let t = this;
                t.add_player_Loading = true;
                t.$util.ajax.post('/admin/applys/add_player', {
                    apply_id: t.$route.params.apply_id,
                    user_id: t.add_player_id,
                    user_level: t.current_select_tree_node[0].level
                }).then(function (response) {
                    let response_data = response.data;
                    t.$Notice.success({
                        title: response_data.message
                    })
                    if( response_data.message == '分配成功'){
                        t.add_player_id = '';
                        t.add_player_show = false;
                        t.getApplyPlayerInfo();
                        t.tree_loading = true;
                    }
                    t.add_player_Loading = false;
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                    t.add_player_Loading = false;
                })
            },
            get_add_player_id(e){
                console.log(e);
                this.add_player_id = e;
            },
            //获取可以参加该报名的所有user
            getApplyPlayerList(){
                let t = this;
                t.$util.ajax.get('/admin/apply_user/' + this.$route.params.apply_id).then(function (response) {
                    if(response.data.status == 'success'){
                        t.apply_user = response.data.data.users;
                        console.log(t.apply_user);
                        t.getApplyPlayerInfo();
                    }
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                    t.open_loading = false;
                });
            },
            getApplyPlayerInfo(){
                let t = this;
                t.apply_player_data = [];
                this.$util.ajax.get('/admin/applysbyplayer/' + this.$route.params.apply_id).then(function (response) {
                    let response_data = response.data;
                    console.log(response_data);
                    if(response_data.status == 'success'){
                        let get_data = response_data.data.applyHasPlayer;
                        for(let index in get_data){
                            console.log(index);
                            console.log(get_data[index]);
                            get_data[index].forEach( (item1) => {
                                item1.title = item1.user.realname;           
                            });
                            var title = '';
                            if(index == 0){
                                title = "门将";
                            }else if(index == 1){
                                title = "一档";
                            }else if(index == 2){
                                title = "二档";
                            }else if(index == 3){
                                title = "三档";
                            }else if(index == 4){
                                title = "四档";
                            }else if(index == 5){
                                title = "五档";
                            }else if(index == 6){
                                title = "六档";
                            }else if(index == 7){
                                title = "七档";
                            }else if(index == 8){
                                title = "八档";
                            }else if(index == 9){
                                title = "九档";
                            }
                            var obj = {
                                title: title,
                                level: index,
                                expand: true,
                                children: get_data[index]
                            }
                            t.apply_player_data.push(obj);
                        }
                    }
                    t.open_loading = false;
                    t.tree_loading = false;
                }, function (error) {
                    t.$Notice.warning({
                        title: '出错了',
                        desc: error.message
                    });
                    t.open_loading = false;
                    t.tree_loading = false;
                });
            },
            
        }
    }

</script>
